<!DOCTYPE html>
<html>
<head>
	<title>My</title>
	<link rel="shortcut icon" href="http://example.com/myicon.ico">
	<meta http-equiv="content-type" content="text/html" charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="css/reset.css" type="text/css" />
	<link rel="stylesheet" href="css/common.css" type="text/css" />
	<link rel="stylesheet" href="css/tylog.css" type="text/css" />
</head>
<body id = "bigby">
	<div class="index-header">
		<div class="header-bg">
				<div class="hd-bgr"></div>
		</div>
		<div class="index-container">
			<div class="header-content">
				<a href="javascript:(0)"><h1>I'M <span >JENN</span></h1></a>
				<p>WELCOME TO MY PORTFOLIO</p>
			</div>
		</div>
	</div>
	<div class="index-body ">
		<div class="main">
			<div class="index-container clearfloat">
				<a class="main-logo"></a>
				<ul class="main-nav">
					<li class="body-nav"><a href="#About Me">About Me</a></li>
					<li class="body-nav"><a href="#Can do">What I Can Do</a></li>
					<li class="body-nav"><a href="#Design">Design Works</a></li>
					<li class="body-nav nav"><a href="javascript:(0)">Pricing Packages </a></li>
					<li class="body-nav"><a href="javascript:(0)">Blog</a></li>
					<li class="body-nav"><a href="javascript:(0)">Contact</a></li>
				</ul>
			</div>
		</div>
		<div class="body-colmn-one">
			<div class="index-container clearfloat">
				<a class="content-title" name="About Me" ><span>About Me</span></a>
				<p class="stage"> 
						Lorem Ipsum is simply dummy text of the printing and	typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown	printer took a galley of type and scrambled it to make a  type specimen book. It has survived not only five         centuries, but also the leap into electronic              typesetting,remaining essentially unchanged.
				</p>
				<p class="stage">
						Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has 
							been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
				</p>
				<ul class="communication-list">
					<li class="every"><a class="talk" href="javascript:(0)"></a></li>
					<li class="every"><a class="talk" href="javascript:(0)"></a></li>
					<li class="every"><a class="talk" href="javascript:(0)"></a></li>
					<li class="every"><a class="talk" href="#"></a></li>
					<li class="every"><a class="talk" href="#"></a></li>
					<li class="every"><a class="talk" href="javascript:(0)"></a></li>
					<li class="every"><a class="talk" href="javascript:(0)"></a></li>
					<li class="every"><a class="talk" href="javascript:(0)"></a></li>
				</ul>
			</div>
		</div>
		<div class="body-colmn-two">
			<div class="two-content-title">
				<div class="index-container clearfloat">
					<a name="Can do" href = "javascript:(0)">I’m Expert In...</a>
				</div>
			</div>
			<div class="content-bg">
				<div class="index-container clearfloat">	
					<div class="content-myskil">
						<a class="little-icon icon-1"></a>
						<h5><a href="javascript:(0)">Graphics Design</a> & Branding</h5>
						<p>
							Lorem Ipsum is simply dummy text</br>
							of the printing and typesetting industry. 
							Lorem Ipsum has been the industry's 
							standard dummy text ever since the 
							1500s, when an unknown printer took </br>
							a galley of type and scrambled it to 
							make a type specimen book. 
						</p>
					</div>
					<div class="content-myskil">
						<a class="little-icon icon-2"></a>
						<h5><a href="javascript:(0)">Web Design</a> & Development</h5>
						<p>
							Lorem Ipsum is simply dummy text</br> 
							of the printing and typesetting industry. 
							Lorem Ipsum has been the industry's 
							standard dummy text ever since the 
							1500s, when an unknown printer took</br> 
							a galley of type and scrambled it to 
							make a type specimen book. 
						</p>
					</div>
					<div class="content-myskil">
						<a class="little-icon icon-3"></a>
						<h5><a href="#">UI Designs</a>  & Codes</h5>
						<p>
							Lorem Ipsum is simply dummy text</br> 
							of the printing and typesetting industry. 
							Lorem Ipsum has been the industry's 
							standard dummy text ever since the 
							1500s, when an unknown printer took</br> 
							a galley of type and scrambled it to 
							make a type specimen book. 
						</p>
					</div>
				</div>
			</div>
		</div>
		<div class="body-colmn-three">
			<div class="title-bg">
				<div class="bgr"></div>
			</div>
			<div class="index-container clearfloat">
				<div class ="third-content-title title-content">
					<a class ="title-note" name="Design">
						TO CREATE INNOVATIVE & CREATE DESIGNS<br/>  
						AND SHARE IT TO THE WORLD FOR FREE.
					</a>
					<p class ="note-bar bor-bar"><span>Our Mission</span></p>	
				</div>
				<div class ="colmn-content-hd">
					<a class="content-title">
						<span>My Design Work</span>
					</a>
					<p class="stage"> 
						Lorem Ipsum is simply dummy text of the printing and	typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown	printer took a galley of type and scrambled it to make a  type specimen book. It has survived not only five         centuries, but also the leap into electronic              typesetting,remaining essentially unchanged.
					</p>
				</div>
				<div class="submenu-list">
					<div></div>
				</div>
			</div>
	</div>
	<div class="index-footer">
		<div class="index-container">
		</div>
	</div>
	
</body>
<script type="text/javascript">
	var b =document.getElementsByClassName('talk')
	for(var i = 0;i < b.length; i++){
		b[i].style.backgroundPositionX = -i*54.45 +'px';
	}
</script>
</html>